﻿<html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <link type="text/css" rel="stylesheet" href="/stylesheets/style.css" />
    <link type="text/css" rel="stylesheet" href="/stylesheets/main.css" />
	<link type="text/css" rel="stylesheet" href="/stylesheets/wariogame.css" />
	<link type="text/css" rel="stylesheet" href="/stylesheets/smoothness/jquery-ui-1.7.1.custom.css" />

	<script src="/scripts/haccordion-0.1.js" type="text/javascript"></script>
	<script src="/scripts/jquery-1.3.2.min.js" type="text/javascript"></script>
	<script src="/scripts/jquery-ui-1.7.1.custom.min.js" type="text/javascript"></script>
	<script type="text/javascript">
		$.ui.dialog.defaults.bgiframe = true;
		$(function() {
			/* http://jqueryui.com/demos/animate/ */
			$("img").each(function(){
				this.onclick = function(event){
					var target = event.target;
					$(target).animate({ 
						borderTopColor: "#7BFA53",
						borderRightColor: "#7BFA53",
						borderBottomColor: "#7BFA53",
						borderLeftColor: "#7BFA53"
						}, 1000);
					/* 
					change:
					title p img
					*/
					$("#content_container").dialog("open")
					return false;
				}
			});
			$("#effect1-1").hide();
			$("#content_container").dialog({ modal: true });
			$("#wario_tabs").tabs();
		});
	</script>
  </head>
  <body>
	<div id="wario_tabs">
		<ul>
			<li><a href="#tabs-1">第一关</a></li>
			<li><a href="#tabs-2">第二关</a></li>
			<li><a href="#tabs-3">第三关</a></li>
		</ul>
		<div id="tabs-1">
			<div id="wario_container">
				<div id="title_container">
					{% for thumb in thumbs %}
					<img src='{{ thumb }}'></img>
					{% endfor %}
				</div>
			</div>
		</div>
		<div id="tabs-2">
			<p>2</p>
		</div>
		<div id="tabs-3">
			<p>3</p>
		</div>
	</div>
	<div id="content_container" title="踏小人">
			<p>摇摆身躯，躲避小人（骆驼？）</p>
			<img src="static/wario0504/1-1.jpg">
	</div>
  </body>
</html>